<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>充值</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="css/style.css" />
	</head>
	<style>
		
		
	</style>

	<body style="padding-top: 44px">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">小柒商城</h1>
		</header>
		<form id="chargeform">
			<div class="money">
				<span data-value="0.10">1柒币</span><span data-value="0.50">50柒币</span><span data-value="1.00">100柒币</span>
				<span data-value="2.00">200柒币</span><span data-value="3.00">300柒币</span><span data-value="4.00">400柒币</span>
				<span class="other-charge" data-value="0.00">其他</span>
			</div>
			<div class="money-change">
				<input class="mui-input-numbox hidemoney" type="number"  onkeyup="this.value=this.value.replace(/[^0-9-]+/,'');" />
				<p><span class="yuan">0.00</span>元</p>
			</div>
			<section class="person">
				<h3><span class="line-left"></span>充值说明</h3>
				<p>1人民币=10柒币,不定期会推出打折活动不定期会推出打折活动，敬请关注.</p>
			</section>
			<section class="charge-select">
				<p><span><img class="success" src="img/success.png"><img src="img/zhifubao.png"  class="zhifubao"></span>支付宝充值</p>
			</section>
			
			<div class="chongzhi">
			
			<a class="mui-btn mui-btn-block">立即充值</a>
		</div>
		</form>
		<script src="js/mui.min.js"></script>
		<script type="text/javascript" src="js/jquery-2.1.4.js" ></script>
		<script type="text/javascript">
			mui.init();
			$('.money span').click(function(){
				var ss=$(this).data('value')
				//var s2=$(this).text()
				//alert(ss)
				$(this).addClass('money-active').siblings().removeClass('money-active')
				$('.yuan').text(ss);
				$('.money-change input').hide();
				$('.hidemoney').val('');
			})
			
			$('.hidemoney').keyup(function(){
				var t_money=$(this).val()/10;
				 //$(this).css("background-color","#D6D6FF");
				$('.yuan').text(t_money);
			})


			$('.other-charge').click(function(){
				$('.money-change input').show();
			})
		</script>
	</body>

</html>